<template>
	<div class="page-login">
		<div class="login-header">
			<a href="/" class="logo"></a>
		</div>
		<!--section分隔-->
		<div class="login-panel">
			<div class="banner">
				<img src="//s0.meituan.net/bs/file/?f=fe-sso-fs:build/page/static/banner/www.jpg" width="480" height="370"/>
			</div>
			<div class="form">
				<h4 v-if="error" class="tips"><i></i>{{error}}</h4>
				<p><span>账号登录</span></p>
				<el-input v-model="username" prefix-icon="profile"></el-input>
				<el-input v-model="password" prefix-icon="password" type="password"></el-input>
				<div class="foot">
					<el-checkbox v-model="checked">7天内自动登录</el-checkbox>
					<b>忘记密码？</b>
				</div>
				<el-button class="btn-login" type="success" size="mini" @click="login">登录</el-button>
			</div>
			
		</div>
	</div>
</template>
<script type="text/javascript">
import CryptoJS from 'crypto-js'
export default{
	layout:'blank',
	name:"login",
	data(){
		return{
			checked:'',
			username:'',
			password:'',
			error:''
		}
	},
	created(){
		
	},
	methods:{
		login(){
			let self = this;
			self.$axios.post('/users/signin',{
				username:window.encodeURIComponent(self.username),
				password:CryptoJS.MD5(self.password).toString()
			}).then(({status,data})=>{
				if(status === 200){
					if(data && data.code === 0){
						location.href = '/'
					}else{
						self.error = data.msg
					}
				}else{
					self.error = `服务器出错,错误码:${status}`
				}
				setTimeout(function(){
					self.error = ''
				},1500)
			})
		}
	},
	computed:{},
	components:{}
}
</script>
<style lang="scss">
@import "@/assets/css/login/index.scss";
</style>